<template>
    <input :type="type" :value="inputValue" @input="inputHandler">
</template>

<script>
    export default {
        props: {
            value: {
                type: String,
                default: ''
            },
            type: {
                type: String,
                default: 'text'
            }
        },
        data() {
            return {
                // 单向流，从父组件过来
                inputValue: this.value
            }
        },
        methods: {
            inputHandler(e) {
                this.inputValue = e.target.value;

                this.$emit("input", this.inputValue)
                // 把输入值传给父组件 进行校验
                this.$parent.$emit('validate', this.inputValue)
            }
        },

    }
</script>

<style scoped>

</style>